<style lang="less">
    @import "autoPay.less";
</style>
<template>
    <Card>
        <div class="search">
            <Form ref="autoPay" :model="autoPay" :rules="autoPayValidate" inline :label-width="200" >
<!--    取消日期配置            -->
<!--                <Row>-->
<!--                    <Form-item label="工作时间" prop="selectDate">-->
<!--                        <DatePicker class="doubleColumn" v-model="selectDate" type="datetimerange" format="yyyy-MM-dd HH:mm:ss" clearable-->
<!--                                    @on-change="selectDateRange">-->
<!--                        </DatePicker>-->
<!--                    </Form-item>-->
<!--                </Row>-->
                <Row>
                    <Form-item label="工作时间" prop="selectDate">
                        <TimePicker class="doubleColumn" v-model="selectTime" type="timerange" placement="bottom-end"
                                    @on-change="selectTimeRange" placeholder="请选择自动付款时间"></TimePicker>
                    </Form-item>
                </Row>
                <Row>
                    <Form-item label="每批付款最大数量" prop="batchMaxNum">
                        <Input type="text" v-model="autoPay.batchMaxNum" clearable
                        />&nbsp;单（0为不限制）
                    </Form-item>
                </Row>
                <Row>
                    <Form-item label="跨行付款银行" prop="interBankTransferBank">
                        <Select v-model="autoPay.interBankTransferBank"  clearable>
                            <Option v-for="item in dataDic.payBank" :value="item.value" :label="item.title" :key="item.value">{{ item.title }}</Option>
                        </Select>
                    </Form-item>
                </Row>
                <Row>
                    <Form-item label="暂不自动付款银行" prop="bankList">
                        <CheckboxGroup  v-model="autoPay.bankList">
                            <Checkbox v-for="item in dataDic.payBank" :label="item.value">
                                <span>{{item.title}}</span>
                            </Checkbox>
                        </CheckboxGroup>
                    </Form-item>
                </Row>
                <Form-item label="自动付款" prop="enableAuto">
                    <i-switch v-model="autoPay.enableAuto" size="large" >
                        <span slot="open">ON</span>
                        <span slot="close">OFF</span>
                    </i-switch>
                </Form-item>
                <Row>
                    <Col align="middle">
                        <Button type="primary" icon="md-checkmark" @click="save">保存</Button>
                    </Col>
                </Row>
            </Form>
        </div>
    </Card>
</template>

<script>
    import {
        getByTypes
    } from "_p/basic/api/admin/datadic";
    import {
        saveAutoPayInfo,
        queryAutoPayInfo
    } from "@/projects/basic/api/contract/pay/autoPay";
    import {isIntegerString} from "@/projects/basic/assets/contract/js/utils";
    export default {
        name: "autoPayManagement",
        data(){
            const isIntegerValue = (rule, value, callback) => {
                if (value) {
                    if (!isIntegerString(value) && value !== '') {
                        callback(new Error("请输入大于等于0的整数"))
                    } else {
                        if(value<0){
                            callback(new Error("请输入大于等于0的整数"))
                        }else{
                            callback()
                        }
                    }
                } else {
                    callback(new Error("请输入大于等于0的整数"))
                }
            };
            const isDateTimeRange = (rule, value, callback) => {
                if (this.autoPay.workStartDate||this.autoPay.workEndDate) {
                    callback()
                } else {
                    callback(new Error("请选择工作日起止时间"))
                }
            };
            const isTimeRange = (rule, value, callback) => {
                if (this.autoPay.workStartTime||this.autoPay.workEndTime) {
                    callback()
                } else {
                    callback(new Error("请选择自动付款起止时间"))
                }
            };
            return {
                selectDate:null,
                selectTime:null,
                autoPay:{enableAuto:true},
                dataDic:{},
                dicKeys: [
                    "payBank"
                ],
                autoPayValidate: {
                    // 表单验证规则
                    batchMaxNum: [
                        {validator: isIntegerValue, trigger: "blur"}
                    ],
                    // selectDate: [
                    //     {validator: isDateTimeRange, trigger: "blur"}
                    // ],
                    selectTime: [
                        {validator: isTimeRange, trigger: "blur"}
                    ],
                    interBankTransferBank: [{required: true, message: "不能为空", trigger: "change"}],
                },
            }
        },
        methods:{
            selectDateRange(v) {
                if (v) {
                    this.autoPay.workStartDate = v[0];
                    this.autoPay.workEndDate = v[1];
                }
            },
            selectTimeRange(v) {
                if (v) {
                    this.autoPay.workStartTime = v[0];
                    this.autoPay.workEndTime = v[1];
                }
            },
            initDataDic(){
                let self = this;
                getByTypes(this.dicKeys).then(res => {
                    if (res.code === "0000" && res.data) {
                        self.dataDic = res.data;
                    }
                });
            },
            save(){
                console.log(this.selectDate);
                this.$refs.autoPay.validate(valid => {
                    if (valid) {
                        this.$Spin.show();
                        let banks = "";
                        if(this.autoPay.bankList){
                            this.autoPay.bankList.forEach(function (e) {
                                banks += e + ",";
                            });
                        }
                        this.autoPay.noAutoBank = banks;
                        saveAutoPayInfo(this.autoPay).then(res => {
                            this.$Spin.hide();
                            if (res.code === "0000" && res.data) {
                                this.$Message.success("配置成功");
                                this.autoPay = res.data;
                                let timeRange = [];
                                timeRange[0] = res.data.workStartTime;
                                timeRange[1] = res.data.workEndTime;
                                this.selectTime = timeRange;
                            }
                        }).catch(e =>{
                            this.$Spin.hide();
                        });
                    }
                });
            },
            initAutoPayInfo(){
                queryAutoPayInfo("123123").then(res => {
                    if (res.code === "0000" && res.data) {
                        this.autoPay = res.data;
                        // let dateRange = [];
                        // dateRange[0] = res.data.workStartDate;
                        // dateRange[1] = res.data.workEndDate;
                        let timeRange = [];
                        timeRange[0] = res.data.workStartTime;
                        timeRange[1] = res.data.workEndTime;
                        this.selectTime = timeRange;
                    }
                });
            }
        },
        mounted() {
            this.initDataDic();
            this.initAutoPayInfo();
        }
    }
</script>

